/*
1. js 代码 es6+
es6+ --> es5 babel

npx webpack --config webpack.config.js

npx 是 nodejs 提供的一个命令，可以执行局部的命令.

- https://www.ruanyifeng.com/blog/2019/02/npx.html

由于我们的 webpack 是局部安装，并不是全局安装的，所以要执行 webpack 命令，则需要使用 npx webpack


思考：为什么不把 webpack 安装成全局包呢？如果是安装的全局包，则可以直接在命令行使用 webpack 命令。而不需要加 npx 前缀
> npm install --global webpack

不推荐全局安装 webpack。这会将你项目中的 webpack 锁定到指定版本，并且在使用不同的 webpack 版本的项目中，可能会导致构建失败。


*/

/* 由于我们使用 webpack 做开发，一般都是单一入口的开发，所有的功能都是在一个js文件里面进行完成的。 */
import './css/index.css';
import './assets/index.less';
import './assets/common.scss';
import 'bootstrap/dist/css/bootstrap.css';

let name = 'andy';

console.log(name);

console.log(name);

console.log(name);

/* 代码片段 snipet */

/*

.box{
    width: 100px;
    height: 100px;
    background-color: #f00;
}

*/

let a = 12;
let b = 34;
const PI = 3.141592653589793;

const add = (a, b) => {
    return a + b;
}

class People {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }

    say() {
        console.log(`${this.name} is ${this.age} years old.`);
    }
}

const p1 = new People('andy', 23);
console.log(p1.name);
p1.say();

console.log(add(a, b), a, b, PI);

/*尝试在js里面把图片当成一个变量使用 使用 file-loader ulr-loader*/
import iphon12Img from './imgs/i12.png';

document.getElementById('imgContainer').src = iphon12Img;

/*
 *
 * api: http://localhost:8081/user/lst
 * 没有进行跨域请求的设置
 *
 * */

document.getElementById('btn').onclick = function () {
    /* http://localhost:9080/api/user/lst */
    let url = '/api/user/lst';
    const xhr = new XMLHttpRequest();
    xhr.open('get', url);

    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4) {
            console.log(xhr.responseText);
        }
    }
    xhr.send();
}